@import '@/lib/reset.scss';

.log-container{
  width: 1000px;
  box-sizing: border-box;
  height: 580px;
  margin: 0 auto;
  padding: 40px 0;
  margin-top: 30px;
  // background: burlywood;
  border-bottom: 1px solid #f3f3f3;
  .logID{
    font-size: 34px;
    padding: 0 0 30px;
    line-height: 1.2;
    font-weight: 700;
    text-align: center;
    padding-bottom: 40px;
    color: #222;
  }
  .log-layout{
    margin: auto;
    padding: 0 0 80px;
    height: 580px;
    // box-sizing: border-box;
    // background: burlywood;
    .log-left{
      margin: 0 0 0 100px;
      font-size: 14px;
      float: left;
      box-sizing: border-box;
      display: block;
      span{
        font-size: 25px;
        padding-right: 5px;
        text-align: center;
        margin-top: 5px;
      }
      .log-qq{
        width: 194px;
        height: 40px;
        line-height: 35px;
        background: #159edd;
        overflow: hidden;
        text-decoration: none;
        vertical-align: baseline;
        cursor: pointer;
        margin-bottom: 15px;
        text-align: center;
        color: #f3f3f3;
        font-size: 16px;
        
      }
      .log-weibo{
        width: 194px;
        height: 40px;
        line-height: 34px;
        background: #dd3915;
        overflow: hidden;
        text-decoration: none;
        vertical-align: baseline;
        cursor: pointer;
        margin-bottom: 15px;
        text-align: center;
        color: #f3f3f3;
        font-size: 16px;
      }
      .log-douban{
        width: 194px;
        height: 40px;
        line-height: 32px;
        background: #106d3e;
        overflow: hidden;
        text-decoration: none;
        vertical-align: baseline;
        cursor: pointer;
        margin-bottom: 15px;
        text-align: center;
        color: #f3f3f3;
        font-size: 16px;
      }
    }
    .log-right{
      float: left;
      box-sizing: border-box;
      margin-left: 50px;
      .log-tel{
        margin: 0 0 30px;
        display: flex;
        .log-telnum{
        // display: inline;
        height: 50px;
        line-height: 50px;
        width: 100px;
        text-align: right;
        margin: 0 10px 0 0;
        display: inline-block;
        vertical-align: baseline;
        cursor: default;
        color: #222;
        font-size: 16px;
        }
        .log-pure{
          position: relative;
          display: block;
          .log-country-code{
            border: 0;
            line-height: 50px;
            color: #000;
            text-indent: 5px;
            font-size: 12px;
            cursor: pointer;
            width: 110px;
            // vertical-align: baseline;
            text-align: center;
            position: relative;
            height: 50px;
            border: 1px solid #eeeeee;
            option{
              position: absolute;
              left: 0;
              top: 0;
              bottom: 0;
              width: 50px;
              border-radius: 0 2px 2px 0;
              box-shadow: inset -55px 0 25px -20px #fff;
            }
          }
          span{
            position: absolute;
            right: 4px;
            top: 50%;
            margin-top: -4px;
            border: 6px solid transparent;
            border-top: 8px solid #000;
          }
        }
        .log-numinp{
          width: 200px;
          position: relative;
          .log-telinp{
            border: 0;
            padding-left: 2px;
            height: 50px;
            word-spacing: normal;
            text-transform: none;
            text-indent: 0px;
            text-shadow: none;
            display: inline-block;
            text-align: start;
            border: 1px solid #eeeeee;
            text-indent: 5px;
          }
          span {
            position: absolute;
            right: -90px;
            top: 15px;
            font-size: 12px;
            color: #dd3915
          }
        }
      }
      .log-verify{
        margin: 0 0 30px;
        display: flex;
        .log-verifyCode{
          height: 50px;
          line-height: 50px;
          width: 100px;
          text-align: right;
          margin: 0 10px 0 0;
          display: inline-block;
          vertical-align: baseline;
          cursor: default;  
          color: #222;
          font-size: 16px;
        }
        .log-sendverify{
          line-height: 50px;
          color: #000;
          // padding:9px;
          font-size: 14px;
          cursor: pointer;
          width: 130px;
          color: #fff;
          text-align: center;
          position: relative;
          height: 50px;
          background: #C7C1B9;
        
        }
        .log-verifyInp{
          // height: 50px;
          width: 290px;
          // word-spacing: normal;
          // text-transform: none;
          // text-indent: 0px;
          // text-shadow: none;
          // display: inline-block;
          border: 1px solid #eeeeee;
          line-height: 50px;
          // text-align: left;
          input{
            height: 47px;
            border: 0;
            padding-left: 2px;
            text-indent: 5px;
            line-height:47px;
          }
        }  
      }
      .log-email{
        width: 434px;
        height: 20px;
        a{
          display: block;
          float: right;
          color: #dd3915;
          font-size: 14px;
          &:hover {
            background-color: #DD3915;
            color: #fff;
          }
        }
      }
      .log-way{
        margin-top: 30px;
        width: 434px;
        height: 20px;
        display: flex;
        justify-content: space-between;
        input{
          margin-left: 50px;
          margin-right: 5px;
        }
        a{
          display: block;
          float: right;
          color: #dd3915;
          font-size: 14px;
          &:hover {
            background-color: #DD3915;
            color: #fff;
          }
        }
      }
      .log-agree{
        margin-top: 30px;
        width: 434px;
        height: 20px;
        margin-left: 50px;
        label{
          color: #909090;
          margin-left: 5px;
          a{
            color: #dd3915;
            font-size: 14px;
          }
        }
      }
      .log-btn{
        margin-top: 30px;
        margin-left: 50px;
        input{
          border: 0;
          color: #fff;
          background: #DD3915;
          border: 1px solid transparent;
          -webkit-appearance: button;
          line-height: normal;
          vertical-align: baseline;
          text-align: center;
          cursor: pointer;
          padding: .5em 2em;
          font-size: 15px;
        }
      }
    }
  }
} 